<template>
  <!-- 月排行 -->
  <div>
    <div class="flRseniority">
      <span @click="getData()">本周排行</span>
      <span>
        <router-link
          style="color: #9dc816; font-size: 16px"
          :to="{ name: 'academic' }"
        >
          More
          <i
            class="iconfont icon-youjiantou"
            style="font-size: 18px; position: relative; top: 2px"
          ></i>
        </router-link>
      </span>
      <div class="flrList">
        <li v-for="(item, index) in flrList" :key="index">
          <a @click="toMenu(item.OpenId)">{{ item.Title }}</a>
        </li>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      caseContList: 0,
      type: 28,
      flrList: [],
    };
  },
  methods: {
    getData() {
      // 加密完成
      this.$httphelper
        .post("/api/JournalArticle/GetSeniorityPaper", {
          Condition: 4,
          Page: 1,
          Limit: 7,
        })
        .then((res) => {
          this.flrList = res.data.data;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    toMenu(id) {
      let userName = sessionStorage.getItem("userName");
      if (userName) {
        this.$uniRouter.push({
          path: "/academic/academicdetail",
          query: {
            id: id,
          },
        });
      } else {
        this.$confirm("请先登录", "提示", {
          customClass: "message-logout",
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          // type: 'warning'
        })
          .then(() => {
            this.$uniRouter.push({
              path: "/login",
            });
          })
          .catch((e) => {
            console.log(e);
          });
      }
    },
  },
  created() {
    this.getData();
  },
};
</script>

<style lang="less" scoped>
.flRseniority {
  width: 250px;
  // height: 32px;
  margin-left: 19px;
  margin-top: 1px;
  span:nth-child(1) {
    // width: 100px;
    width: 90px;
    height: 32px;
    color: #333;
    font-size: 20px;
    text-align: center;
    line-height: 22px;
    font-family: "SourceHanSansSC-Regular";
    // border-bottom:2px solid #EEEEEE;
    // border-bottom: 2px solid #003c80;
    cursor: pointer;
  }
  span:nth-child(2) {
    float: right;
    width: 157px;
    height: 32px;
    line-height: 22px;
    font-size: 16px;
    text-align: right;
    cursor: pointer;
  }
}
.flrList {
  border: 1px #cccccc solid;
  box-shadow: 0 0 3px 0px #999;
  padding: 10px;
  width: 250px;
  // height: 293px;
  // margin-left: 19px;
  margin-top: 10px;
  li:last-child {
    border-bottom: none;
  }
  li {
    list-style: none;
    padding: 10px 0;
    width: 100%;
    height: 37px;
    border-bottom: 1px solid #eeeeee;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    white-space: nowrap;
    a {
      color: #333333;
      font-size: 14px;
      // font-weight: bold;
    }
    a:hover {
      color: #003c80;
    }
  }
  .router-link-active {
    color: #003c80;
  }
}
</style>
<style>
@media screen and (max-width: 1010px) {
  .message-logout {
    width: 80% !important;
  }
}
</style>